﻿@using System.Net.Http.Json;
<MToolbar Color="orange accent-1">
    <ChildContent>
        <MAppBarNavIcon Class="hidden-sm-and-down"></MAppBarNavIcon>
        <MToolbarTitle Class="text-h6 mr-6 hidden-sm-and-down">
            Cryptocurrency
        </MToolbarTitle>
        <MAutocomplete @bind-Value="_model"
                       Items="_items"
                       Loading="_isLoading"
                       OnSearchInputUpdate="Search"
                       Chips
                       Clearable
                       HideDetails="true"
                       HideSelected
                       ItemText="r=>r.Name"
                       ItemValue="r=>r.Symbol"
                       Label="Search for a coin..."
                       Solo>
            <NoDataContent>
                <MListItem>
                    <MListItemTitle>
                        Search for your favorite
                        <strong>Cryptocurrency</strong>
                    </MListItemTitle>
                </MListItem>
            </NoDataContent>
            <SelectionContent Context="data">
                <MChip Color="blue-grey"
                       Class="white--text">
                    <MIcon Left>
                        mdi-bitcoin
                    </MIcon>
                    <span>
                        @data.Item.Name
                    </span>
                </MChip>
            </SelectionContent>
            <ItemContent Context="data">
                <MListItemAvatar Color="indigo"
                                 Class="text-h5 font-weight-light white--text">
                    @data.Item.Name[0]
                </MListItemAvatar>
                <MListItemContent>
                    <MListItemTitle>
                        @data.Item.Name
                    </MListItemTitle>
                    <MListItemSubtitle>
                        @data.Item.Symbol
                    </MListItemSubtitle>
                </MListItemContent>
                <MListItemAction>
                    <MIcon>mdi-bitcoin</MIcon>
                </MListItemAction>
            </ItemContent>
        </MAutocomplete>
    </ChildContent>
    <ExtensionContent>
        <MTabs @bind-Value="_tab"
               HideSlider="_model==null"
               Color="blue-grey"
               SliderColor="blue-grey">
            <MTab Disabled="_model==null">
                News
            </MTab>
            <MTab Disabled="_model==null">
                Trading
            </MTab>
            <MTab Disabled="_model==null">
                Blog
            </MTab>
        </MTabs>
    </ExtensionContent>
</MToolbar>

@code {
    class Currency
    {
        public string Id { get; set; }

        public string Symbol { get; set; }

        public string Name { get; set; }
    }

    private bool _isLoading;
    private List<Currency> _items = new List<Currency>();
    private string _model;
    private StringNumber _tab;

    protected string Model
    {
        get
        {
            return _model;
        }
        set
        {
            _model = value;

            if (value != null)
            {
                _tab = 0;
            }
            else
            {
                _tab = null;
            }
        }
    }

    [Inject]
    public IHttpClientFactory HttpClientFactory { get; set; }

    public async Task Search(string val)
    {
        if (_items.Count > 0)
        {
            return;
        }

        _isLoading = true;
        var httpClient = HttpClientFactory.CreateClient("doc");
        var items = await httpClient.GetFromJsonAsync<List<Currency>>("/_content/Masa.Blazor.Doc/list.json");
        _items = items.Take(20).ToList();//TODO:Wait for MSelect update
        _isLoading = false;
    }
}